import React, { useState } from 'react'
/* useState:
    -让函数式组件支持state状态
    -useState()方法里面唯一的参数就是初识 state
    -useState返回一个只有两个元素的数组
      -第一个元素是当前的 state 的值
      -第二个元素是一个函数,用来替换原来state中的值,这个函数的修改state和setState一样是异步的
    -React 会在重复渲染时记住它当前state的值,并且提供最新的值给我们的函数
 */

export default function App() {
  
  const [count, setCount] = useState(0);
  const [isHot, setIsHot] = useState(false);
  const [person, setPerson] = useState(['张麻子','李四','王五']);

  const setCountHandle = () => {
    setCount(count + 1);
    console.log(count,'333');
  }

  console.log('组件被重新渲染了');
  
  return (
    <div>
    <h1>累加的值是{count}</h1>
    <h2>天气真的{isHot ? '热啊' :'冷啊'}</h2>
    <button onClick={setCountHandle}>累加</button>  
    </div>
  )
}
 